import React, { useState } from 'react';
import { useTemplateContext } from '@/contexts/TemplateContext';
import { toast } from 'sonner';

const TemplateManagementPanel: React.FC = () => {
  const { openTemplateEditor, deleteTemplate, selectedTemplate, openImportTemplate } = useTemplateContext();
  const [fileInput, setFileInput] = useState<HTMLInputElement | null>(null);
  
  const handleAddTemplate = () => {
    openTemplateEditor();
  };
  
  const handleEditTemplate = () => {
    if (!selectedTemplate) {
      toast.error('请先选择一个模板');
      return;
    }
    openTemplateEditor();
  };
  
  const handleDeleteTemplate = () => {
    if (!selectedTemplate) {
      toast.error('请先选择一个模板');
      return;
    }
    
    if (window.confirm(`确定要删除模板 "${selectedTemplate.title}" 吗？`)) {
      deleteTemplate(selectedTemplate.id);
      toast.success('模板删除成功');
    }
  };
  
  const handleImportTemplate = () => {
    openImportTemplate();
  };
  
  return (
    <div className="flex flex-wrap gap-3 mt-4">
      <button
        onClick={handleAddTemplate}
        className="px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600 transition-colors"
      >
        <i className="fa-solid fa-plus mr-2"></i>添加新模板
      </button>
      <button
        onClick={handleEditTemplate}
        className="px-4 py-2 bg-gray-500 text-white rounded-md hover:bg-gray-600 transition-colors"
        disabled={!selectedTemplate}
      >
        <i className="fa-solid fa-edit mr-2"></i>编辑当前模板
      </button>
      <button
        onClick={handleDeleteTemplate}
        className="px-4 py-2 bg-red-500 text-white rounded-md hover:bg-red-600 transition-colors"
        disabled={!selectedTemplate}
      >
        <i className="fa-solid fa-trash mr-2"></i>删除当前模板
      </button>
      <button
        onClick={handleImportTemplate}
        className="px-4 py-2 bg-green-500 text-white rounded-md hover:bg-green-600 transition-colors"
      >
        <i className="fa-solid fa-upload mr-2"></i>导入模板
      </button>
    </div>
  );
};

export default TemplateManagementPanel;